<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    {% load static %}
    <!-- 新 Bootstrap4 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">

    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>

    <!-- bootstrap.bundle.min.js 用于弹窗、提示、下拉菜单，包含了 popper.min.js -->
    <script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>

    <!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
    <script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
    <style type="text/css">
        body{
            background-image: url("{% static 'images/tupian1.jpg' %}");
            background-repeat: no-repeat;
            background-size: cover;
            background-attachment: fixed;
        }
        .but{
            margin-top: 15px;
            width: 180px;
            height: 30px;
            font-size: 20px;
            font-weight: 700;
            color: #fff;
            background:linear-gradient(to right,#f30909 0%,#4013e6e1 100%);
            border: 0;
            border-radius: 15px;
        }
        h1{
            color: white;
            text-shadow:0 0 10px;
            letter-spacing: 1px;
            text-align: center;
        }
    </style>

</head>
<body>
<h1>服务详情</h1>
<div style="top: 10px; left: 0px;width: 70%; margin-top: 0%;margin-left: 90%;margin-right: 0%;">
    <button class="but" onclick="location='/app/emp/selectService/'" >返回</button>
</div>

<hr width="80%">

<table border="1" width="600" cellspacing="0" style="text-align: center" class="table table-dark table-hover">
    <thead>
        <tr>
            <th>员工编号</th>
            <th>员工姓名</th>
            <th>员工工作</th>
            <th>员工价格/每次</th>
            <th>员工聘用情况</th>
            <th>操作</th>
        </tr>
    </thead>

    <tbody>
    {% for emp in empList %}
        <tr>
            <td>{{ emp.empno }}</td>
            <td>{{ emp.ename}}</td>
            <td>{{ emp.job }}</td>
            <td>{{ emp.salary }}</td>
            <td>
                {% if emp.judge %}
                    已被聘用
                 {% else %}
                    可以聘用
                {% endif %}
            </td>
            <td>
                {% if emp.judge  %}
                    <button onclick="location='/app/emp/employ/{{ emp.empno}}'" disabled>聘用</button>
                    <button onclick="location='/app/emp/cancelemploy/{{ emp.empno}}'" >取消聘用</button>
                {% else %}
                    <button onclick="location='/app/emp/employ/{{ emp.empno}}'" >聘用</button>
                     <button onclick="location='/app/emp/cancelemploy/{{ emp.empno}}'" disabled>取消聘用</button>
                {% endif %}
        </tr>
    {% endfor %}
    </tbody>
</table>
</body>
</html>
